import React from 'react'
import { Form, Input, Button, Checkbox } from 'antd';
import { render } from '@testing-library/react';

;

const click = (event) => {
    console.log(event.target)
}
class App extends React.Component {
    constructor() {
        super()
        this.state = {
            layout = {
                labelCol: {
                    span: 8,
                },
                wrapperCol: {
                    span: 16,
                },
            },
            tailLayout = {
                wrapperCol: {
                    offset: 8,
                    span: 16,
                },
            }
        }
        this.onFinish = (values) => {
            console.log('Success:', values);
        };

        this.onFinishFailed = (errorInfo) => {
            console.log('Failed:', errorInfo);
        };

    }
    render() {
        const { layout, tailLayout } = this.state
        return
        <div>
            <Form
                {...layout}
                name="basic"
                initialValues={{
                    remember: true,
                }}
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}
            >
                <Form.Item
                    label="你的名字"
                    name="username"
                    rules={[
                        {
                            required: true,
                            message: '输入的不正确',
                        },
                    ]}
                >
                    <Input />
                </Form.Item>

                <Form.Item {...tailLayout} name="remember" valuePropName="checked">
                    <Checkbox>Remember me</Checkbox>
                </Form.Item>

                <Form.Item {...tailLayout}>
                    <Button type="primary" htmlType="submit" onClick={click}>
                        Submit
        </Button>
                </Form.Item>
            </Form>
        </div>
    }
}
export default App